<div class="">
    <div class="row">
        <div class="portlet portlet-border">
            <div class="panel-collapse collapse in" id="creative-base">
                <div class="portlet-body p-0 portlet-body-content-page">
                    <div id="panel_reportMenu" class="side-menu-left">
                        <ul>
                            <li class="text-muted menu-title">基本</li>
                            <li class="has_sub">
                                <a href="javascript:" class="waves-effect active"><span>趋势</span><span class="icon-operate icon-rotate"><i class="fa fa-angle-down"></i></span></a>
                                <ul class="list-unstyled" style="display: block">
                                    <li class="active"><a class="waves-effect chart-active" href="javascript:" data-chart-type="line" data-chart-xAxisLen="-1"   data-table-sort-index="0"  data-select-value="hour">时报</a></li>
                                    <li><a class="waves-effect" href="javascript:" data-chart-type="line"  data-chart-by-desc="true"  data-table-sort-index="0" data-select-value="day">日报</a></li>
                                </ul>
                            </li>
                            <li class="has_sub">
                                <a href="javascript:" class="waves-effect" data-chart-type="bar" data-table-sort-index="1" data-select-value="strategyGroup"><span>策略分组</span> </a>
                            </li>
                            <li class="has_sub">
                                <a href="javascript:" class="waves-effect" data-chart-type="bar" data-table-sort-index="1" data-select-value="strategy"><span>策略</span> </a>
                            </li>
                            <li class="text-muted menu-title">受众</li>
                            <li class="has_sub">
                                <!--<a href="javascript:" class="waves-effect active chart-active" data-chart-type="bar" data-table-sort-index="1" data-select-value="city"><span>地域</span></a>-->
                                <a href="javascript:" class="waves-effect" data-chart-type="bar" data-table-sort-index="1" data-select-value="city"><span>地域</span></a>
                                <a href="javascript:" class="waves-effect" data-chart-type="bar" data-table-sort-index="1" data-select-value="gender"><span>性别</span></a>
                                <a href="javascript:" class="waves-effect" data-chart-type="bar" data-table-sort-index="1" data-select-value="age"><span>年龄</span></a>
                            </li>
                        </ul>
                    </div>
                    <div class="content-page-right" style="min-height: 720px">
                        <div class="content-right">
                            <div class="m-b-10">
                                <h3 class="pull-left">
                                    <div class="ellipsis-txt-title" style="max-width: 450px"><span id="sp_advertiserName" class="color-black"></span></div>
                                </h3>
                                <div class="pull-right m-t-10">
                                    <div class="timeDay" style="display: none">
                                        <input type="text" class="form-control w-250" id="txt_day">
                                    </div>
                                    <div class="timeRange"  >
                                        <input type="text" class="form-control w-250" id="txt_range">
                                    </div>
                                </div>

                                <div class="clearfix"></div>
                            </div>
                            <div style="padding-right: 20px;height: 40px">
                                <h4 class="pull-left m-0" id="sp_reportTitle">受众-地域</h4>
                                <div id="chart_btnGroup" class="button-list pull-right m-r-10" style="">
                                    <button class="btn btn-frame-w1 waves-effect text-right btn-default" type="button" value="pv">展示数</button>
                                    <button class="btn btn-frame-w1 waves-effect text-right btn-default" type="button" value="click">点击数</button>
                                    <button class="btn btn-frame-w1 waves-effect text-right btn-white" type="button" value="cr">点击率</button>
                                    <button class="btn btn-frame-w1 waves-effect text-right btn-white" type="button" value="price">点击均价</button>
                                    <button class="btn btn-frame-w1 waves-effect text-right btn-white" type="button" value="cost">花费</button>
                                </div>
                            </div>
                            <div class="datajsonload">
                                <div id="chart_report" class="panel-loading-multiple" style="height:400px;"></div>
                            </div>
                            <button class="btn btn-default waves-effect waves-light m-t-10" id="btn_download" >
                                <i class="fa fa-cloud-download"></i>
                                <span>导出报告</span>
                            </button>
                            <div class="datajsonload">
                                <div class="table-custom p-t-10 panel-loading-multiple"  id="panel_table_chart">
                                    <table class="table table-bordered table-bordered-topbottom dataTable-sorting" id="tb_list" width="100%">
                                        <thead>
                                        <tr>
                                            <th class="sort-custom"><span id="th_menuName">地域</span><i class="fa sort-asc-desc"></i></th>
                                            <th>展示数</th>
                                            <th>点击数</th>
                                            <th>点击率(%)</th>
                                            <th>点击均价(<i class="fa fa-rmb"></i>)</th>
                                            <th>花费(<i class="fa fa-rmb"></i>)</th>
                                        </tr>
                                        </thead>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

